/* Bootstrap 
-------------------------------------------------- */


html, body { height: 100%;
  width: 100%;
}



body { padding-bottom: 0px; }

.text-top {background-color: rgba(0, 0, 0,0.4); 

  display: table-cell;
  text-align: center;
  vertical-align: middle;
}



/*ーーーーーーーーーーーーーーーーーーーーーー背景　透過動画　フイルターーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/


.background-color0 {background-color: rgba(0, 0, 0,0.0);}

.background-color1{background-color: rgba(0,0,0,0.1);}
.background-color1r{background-color: rgba(255,0,0,0.1);}
.background-color1g{background-color: rgba(0,255,0,0.1);}
.background-color1b{background-color: rgba(0,0,255,0.1);}


.background-color11{background-color: rgba(0,0,0,0.1);}
.background-color11r{background-color: rgba(128,0,0,0.1);}
.background-color11g{background-color: rgba(0,128,0,0.1);}
.background-color11b{background-color: rgba(0,0,128,0.1);}



.background-color2{background-color: rgba(0,0,0,0.2);}
.background-color2r{background-color: rgba(255,0,0,0.2);}
.background-color2g{background-color: rgba(0,255,0,0.2);}
.background-color2b{background-color: rgba(0,0,255,0.2);}
.background-color20{background-color: rgba(255,255,255,0.2);}




.background-color4{background-color: rgba(0,0,0,0.4);}
.background-color4r{background-color: rgba(255,0,0,0.4);}
.background-color4g{background-color: rgba(0,255,0,0.4);}
.background-color4b{background-color: rgba(0,0,255,0.4);}
.background-color40{background-color: rgba(255,255,255,0.4);}

.background-color41{background-color: rgba(0,0,0,0.4);}
.background-color41r{background-color: rgba(128,0,0,0.4);}
.background-color41g{background-color: rgba(0,128,0,0.4);}
.background-color41b{background-color: rgba(0,0,128,0.4);}
.background-color410{background-color: rgba(128,128,128,0.4);}


.background-color6{background-color: rgba(0,0,0,0.6);}
.background-color6r{background-color: rgba(255,0,0,0.6);}
.background-color6g{background-color: rgba(0,255,0,0.6);}
.background-color6b{background-color: rgba(0,0,255,0.6);}


.background-color61{background-color: rgba(0,0,0,0.6);}
.background-color61r{background-color: rgba(128,0,0,0.6);}
.background-color61g{background-color: rgba(0,128,0,0.6);}
.background-color61b{background-color: rgba(0,0,128,0.6);}
.background-color610{background-color: rgba(128,128,128,0.6);}


.background-color8{background-color: rgba(0,0,0,0.8);}
.background-color8r{background-color: rgba(255,0,0,0.8);}
.background-color8g{background-color: rgba(0,255,0,0.8);}
.background-color8b{background-color: rgba(0,0,255,0.8);}



.background-color2rg{background-color: rgba(250,250,0,0.2);}
.background-color2gb{background-color: rgba(0,250,250,0.2);}
.background-color2rb{background-color: rgba(250,0,250,0.2);}


.background-color4rg{background-color: rgba(250,250,0,0.4);}
.background-color4gb{background-color: rgba(0,250,250,0.4);}
.background-color4rb{background-color: rgba(250,0,250,0.4);}


.background-color6rg{background-color: rgba(250,250,0,0.6);}
.background-color6gb{background-color: rgba(0,250,250,0.6);}






/*ーーーーーーーーーーーーーーーーーーーーーー背景アルバム　標準 ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー*/



/*ーーーーーーー軽量　背景画像 線形グラデーション指定ーーーーーーーーーーーーーー*/
  .background-fly1{ background-color: #FFFFFF;background-image: linear-gradient(180deg, #FFFFFF 0%, #6284FF 50%, #FF0000 100%) ; }
  .background-fly2{background-color: #52ACFF;background-image:linear-gradient(180deg, #52ACFF 25%, #FFE32C 100%);  }
  .background-fly3{background-color: #FFE53B;background-image: linear-gradient(147deg, #FFE53B 0%, #FF2525 74%);  }
  .background-fly4{background-color: #FAACA8;background-image: linear-gradient(19deg, #FAACA8 0%, #DDD6F3 100%); }
  .background-fly5{background-color: #21D4FD;background-image: linear-gradient(19deg, #21D4FD 0%, #B721FF 100%);}
  .background-fly6{background-color: #08AEEA;background-image: linear-gradient(0deg, #08AEEA 0%, #2AF598 100%); }
  .background-fly7{background-color: #FEE140;background-image: linear-gradient(90deg, #FEE140 0%, #FA709A 100%); }
  .background-fly8{background-color: #8EC5FC;background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%); }
  .background-fly9{background-color: #FBAB7E;background-image: linear-gradient(343deg, #FBAB7E 0%, #F7CE68 100%); }
  
  
  

  
  
  
  
  
  .background-fly01{background-color: #FF3CAC;background-image: linear-gradient(225deg, #FF3CAC 0%, #784BA0 50%, #2B86C5 100%);  }
  .background-fly02{background-color: #D9AFD9;background-image: linear-gradient(0deg, #D9AFD9 0%, #97D9E1 100%);  }  
  .background-fly03{background-color: #00DBDE;background-image: linear-gradient(90deg, #00DBDE 0%, #FC00FF 100%);  }
  .background-fly04{background-color: #F4D03F;background-image: linear-gradient(132deg, #F4D03F 0%, #16A085 100%);  }
  .background-fly05{background-color: #0093E9;background-image: linear-gradient(160deg, #0093E9 0%, #80D0C7 100%);  }
  .background-fly06{background-color: #74EBD5;background-image: linear-gradient(90deg, #74EBD5 0%, #9FACE6 100%);  }
  .background-fly07{background-color: #FAD961;background-image: linear-gradient(90deg, #FAD961 0%, #F76B1C 100%);  }
  .background-fly08{background-color: #FA8BFF;background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BFF88 90%);  }
 .background-fly09{background-color: #FBDA61;background-image: linear-gradient(45deg, #FBDA61 0%, #FF5ACD 100%);  }


 
  .background-fly01s{background-color: #FF3CAC;background-image: linear-gradient(225deg, #FF3CAC 0%, #784BA0 50%, #2B86C5 100%); width:640px; height: 400px;}
  .background-fly02s{background-color: #D9AFD9;background-image: linear-gradient(0deg, #D9AFD9 0%, #97D9E1 100%,); width:640px; height: 400px; }  

   .background-fly03s{background: linear-gradient(90deg, #61d8fa 10%, #1c3df7 32%, #1a1a1b 54%); width:640px; height: 400px; }  

   /*ーーーーーーー　 背景透過ーーーーーーーーーーー*/

 
    /*ーーーーーーー　 左側gradien　背景透過ーーーーーーーーーーー*/

 .background-fly1t{ background: linear-gradient(90deg, rgba(0, 0, 128, 0.6), rgba(0, 128, 0, 0.6))  ; }
 .background-fly2t{ background: linear-gradient(90deg, rgba(0, 64, 64, 0.6), rgba(0, 64, 0, 0.6))  ; }
 .background-fly3t{ background: linear-gradient(90deg, rgba(128, 128, 0, 0.6), rgba(0, 128, 0, 0.6))  ; }
    /*ーーーーーーー　 bottom gradien　背景透過ーーーーーーーーーーー*/

 .background-fly4t{ background: linear-gradient(0deg, rgba(0, 128, 128, 0.6), rgba(0, 128, 0, 0.7))  ; }
 .background-fly5t{ background: linear-gradient(0deg, rgba(128, 0, 128, 0.6), rgba(0, 128, 0, 0.6))  ; }
 .background-fly6t{ background: linear-gradient(0deg, rgba(128, 128, 0, 0.6), rgba(0, 128, 0, 0.6))  ; }

    /*ーーーーーーー　t0p gradien　背景透過ーーーーーーーーーーー*/

 .background-fly7t{ background: linear-gradient(180deg, rgba(0, 128, 128, 0.6), rgba(0, 128, 0, 0.6))  ; }
 .background-fly8t{ background: linear-gradient(180deg, rgba(128, 0, 128, 0.6), rgba(0, 128, 0, 0.6))  ; }
 .background-fly9t{ background: linear-gradient(180deg, rgba(128, 128, 0, 0.6), rgba(0, 128, 0, 0.6))  ; }
 .background-fly10t{ background: linear-gradient(90deg, rgba(0, 0, 64, 0.2), rgba(0, 128, 32, 0.7))  ; }
 .background-fly11t{ background: linear-gradient(90deg, rgba(0, 0, 255, 0.2) 23%, rgba(0, 128, 128, 0.5) 45%, rgba(64, 64, 64, 0.7)57%)  ; }
 .background-fly12t{ background: linear-gradient(90deg, rgba(0, 0, 255, 0.2) 50%,  rgba(64, 64, 64, 0.7)50%)  ; }
 .background-fly13t{ background: linear-gradient(90deg, rgba(0, 0, 128, 0.4), rgba(0, 128, 0, 0.2))  ; }

 
 
  
  

  /*ーーーーーーー　 背景透過ー 泡ー雨ー星ーーーーーーーーーーー*/

  .background-fly10 {  background: url(../images3/16-6-20-2.gif) ; }
  .background-fly11 {  background: url(../images3/16-6-20-1.gif) ; }
  .background-fly12 {  background: url(../images3/16-6-20-13.gif) ; }
  .background-fly13 {  background: url(../images2017/17-11-28-2.gif) ; }  
  .background-fly14 {  background: url(../images2017/17-11-28-3.gif) ; }
  .background-fly15 {  background: url(../images2018/18-1-31-3.gif) ; }/*ーーーーーーー　 背景透過ー雪ーーーーーーーーーーー*/
  .background-fly16 {  background: url(../images2018/18-2-8-2.gif) ; }
  .background-fly17 {  background: url(../images2018/18-1-1-103.gif) ; }
  .background-fly18 {  background: url(../images2018/18-7-4-2.gif) ; }


  /*ーーーーーーー　テクスチャーの画像 ーーーーーーーーーーー*/

  .background-fly20 {  background: url(../images3/pattern.png) ; }
  .background-fly21 {  background: url(../images3/pattern2.png) ; }
  .background-fly22 {  background: url(../images3/pattern3.png) ; }
  .background-fly23 {  background: url(../images3/pattern4.png) ; }
  .background-fly24 {  background: url(../images3/pattern5.png) ; }
  .background-fly25 {  background: url(../images3/pattern6.png) ; }
  .background-fly26 {  background: url(../images3/pattern7.png) ; }
  .background-fly27 {  background: url(../images3/pattern8.png) ; }
  .background-fly28 {  background: url(../images3/pattern9.png) ; }
  .background-fly29 {  background: url(../images3/pattern10.png) ; }
  .background-fly30 {  background: url(../images3/pattern11.png) ; }
  .background-fly31 {  background: url(../images3/pattern12.png) ; }
  .background-fly32 {  background: url(../images3/pattern13.png) ; }
  .background-fly33 {  background: url(../images3/pattern14.png) ; }
  .background-fly34 {  background: url(../images3/pattern15.png) ; }
  .background-fly35 {  background: url(../images3/pattern16.png) ; }

  
  
  
  
    /*ーーーーーーー　svg 背景画像 ーーーーーーーーーーー*/

  
  
  
  


 

  
  
  
  
  
  
  
  
  
  
  
  
 


/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーースマホーーーーーーーーーーーーーーーーーーー*/









@media (max-width: 750px) {  


  
 
 
   #hajimeeiga2018-4{
    background: url(../images2017/17-12-16-4.svg) no-repeat center center;
    display: table;
    width: 100%;
    height: 100%;
    position: relative;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
 
 
 
    #hajimeeiga2018-5{
    background: url(../images2018/18-3-9-2.svg) no-repeat center center;
    display: table;
    width: 100%;
    height: 100%;
    position: relative;

    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }

 
 

 
 
 
     #hajimeeiga2018-6{
    background: url(../images2018/18-3-9-1.svg) no-repeat center center fixed;
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }


 
 
 
 
 
 
 
 
 
 
 
 
 
  #products-end000 {
    background: url(../images4/16-11-14-3.jpg ) no-repeat center center;
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

  }

 
   }


  
  
  

/*ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーパソコンーーーーーーーーーーーーーーーーーーー*/






@media (min-width: 750px) { 



  #hajimeeiga2018-4{
    background: url(../images2017/17-12-16-4.svg) no-repeat center center fixed;
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
 
   #hajimeeiga2018-5{
    background: url(../images2018/18-3-9-2.svg) no-repeat center center fixed;
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }
 

 
    #hajimeeiga2018-6{
    background: url(../images2018/18-3-9-1.svg) no-repeat center center fixed;
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }

 
 
 
 
 
 
 
 
   #products-end000 {
    background: url(../images4/16-11-14-3.jpg ) no-repeat center center fixed;
    display: table;
    height: 100%;
    position: relative;
    width: 100%;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

  }

  }